<template>
  <basic-container>
    <avue-crud
        v-if="tableOption"
        v-bind="bindVal"
        v-on="onEvent"
        @cell-dblclick="rowDblclick">
      <template #menu-btn="{type,size,row}">
        <el-dropdown-item type="type" icon="el-icon-edit" @click="designForm(row)">设计</el-dropdown-item>
        <el-dropdown-item type="type" icon="el-icon-edit" @click="viewData(row)">查看数据</el-dropdown-item>
        <el-dropdown-item type="type" icon="el-icon-search" @click="$refs.formHistoryVersionDialog.show(row)">历史记录
        </el-dropdown-item>
      </template>
      <template #menu="{type,size,row}">
        <el-button
            v-if="row.deploymentStatus===0"
            link
            icon="el-icon-search"
            :size="size"
            @click="syncDataBaseFrom(row)"
            :type="type">部署
        </el-button>

      </template>
    </avue-crud>
    <form-preview-data ref="formPreviewData"></form-preview-data>
    <start-form-design-dialog ref="startFormDesignDialog" @submit="refreshChange"></start-form-design-dialog>
    <form-history-version-dialog ref="formHistoryVersionDialog"></form-history-version-dialog>
  </basic-container>
</template>

<script>

import {createDynamicMixin} from "@/mixins/startCrud.js";
import createMenu from "./createMenu.vue";
import createShare from "./createShare.vue";
import formApi from "../../../../api/start/formEngine/formApi";
import StartFormDesignDialog from "components/start-form-design/start-form-design-dialog.vue";
import FormPreviewData from "@/views/start/formEngine/form/formPreviewData.vue";
import FormPreviewTable from "components/form-design/formPreviewTable.vue";
import FormHistoryVersionDialog from "@/views/start/formEngine/form/formHistoryVersionDialog.vue";


export default {
  mixins: [createDynamicMixin({name: "start/formEngine/form"})],
  components: {
    FormHistoryVersionDialog,
    FormPreviewTable, FormPreviewData, StartFormDesignDialog, createMenu, createShare
  },
  created() {

  },
  mounted() {
  },
  methods: {
    loadCrudColumnBefore(column) {
      if (column.prop === 'tableVersion') {
        column.hide = true;
      }
    },
    beforeLoadDataSource(search) {
      search.start_search_tableVersion = 0;
    },
    beforeOpenAddDialog(form, done) {
      this.$refs.startFormDesignDialog.show(null)

    },
    designForm(row) {
      this.$refs.startFormDesignDialog.show(row.id)
    },
    viewData(row) {
      this.$refs.formPreviewData.show(row.id);
    },
    createMenu(row) {
      this.$refs.createMenu.show(row)
    },
    rowDblclick(row, column) {
      this.$refs.startTableCrud.rowEdit(row, row.$index)
    },
    shareForm(row) {
      this.$refs.createShare.show(row);
    },
    syncDataBaseFrom(row) {
      this.$confirm(`此操作将可能导致【${row.formName}】表单数据丢失！, 是否继续?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        return formApi.synchronizationTable(row.id)
      }).then(res => {
        this.$message({
          showClose: true,
          message: '同步成功',
          type: 'success'
        });
        this.loadRemoteDataSources()
      })
    }
  }
}
</script>

<style scoped>

</style>
